<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="common/common.css"/>
		<link rel="stylesheet" type="text/css" href="common/reset.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/css/swiper.min.css">
	</head>
	<body>
		<div class="container">
			<header>
				<div class="logo fl">
					<img src="common/images/logo.png"/>
				</div>
				<div class="top_r fr">
					<img src="common/images/wechact.png"/>
				</div>
				<nav class="fr">
					<ul>
						<li class="active"><a href="index.html">首页<p>home</p></a></li>
						<li><a href="game.html">游戏<p>game</p></a></li>
						<li><a href="case.html">案例<p>Case</p></a></li>
						<li><a href="about.html">关于我们<p>About us</p></a></li>
					</ul>
				</nav> 
			</header>
			<!--banner-->
			<div class="banner swiper-container">
				<div class="swiper-wrapper">
			        <div class="swiper-slide"><img src="common/images/banner.png"/></div>
			        <div class="swiper-slide"><img src="common/images/banner.png"/></div>
			        <div class="swiper-slide"><img src="common/images/banner.png"/></div>
			        <div class="swiper-slide"><img src="common/images/banner.png"/></div>
			   	</div>
			    <!-- 如果需要分页器 -->
    			<div class="swiper-pagination"></div>
			</div>
			<!--页面中部-->
			<div class="content clearfix">
				<!--左边栏-->
				<div class="cont_l fl">
					<div class="cl_pic1">
						<img src="img/left_01.png"/>
					</div>
					<div class="cl_pic2">
						<img src="img/left_02.png"/>
					</div>
					<div class="cl_pic3">
						<img src="img/left_03.png"/>
					</div>
				</div>
				<!--中间栏-->
				<div class="cont_c fl">
					<!--中间栏上部-->
					<div class="ctc_t clearfix">
						<div class="ct_wrap1 fl">
							<img src="img/icon1.png"/>
							<h3>STEP ONE</h3>
							<p>选择一个游戏，换图</p>
						</div>
						<div class="ct_oht1 fl">
							<img src="img/jt.png"/>
						</div>
						<div class="ct_wrap2 fl">
							<img src="img/icon2.png"/>
							<h3>THE SECOND STEP</h3>
							<p>选择一个游戏，换图</p>
						</div>
						<div class="ct_oht2 fl">
							<img src="img/jt.png"/>
						</div>
						<div class="ct_wrap3 fl">
							<img src="img/cion3.png"/>
							<h3>THE THIRD STEP</h3>
							<p>选择一个游戏，换图</p>
						</div>
					</div>
					<!--中间栏中部-->
					<div class="ctc_m">
						<div class="cmt clearfix">
							<div class="cmt_l fl">
								<h3>狂转游戏</h3>
								<p><span>Turn</span> mad game</p>
							</div>
							<div class="cmt_r fl">
								<p>潮流趣味游戏，引发全民G点，疯狂转发。
									还不马上购买，植入你要传播的产品？</p>
							</div>
						</div>
						<div class="cmb clearfix">
							<div class="cmb_wrap">
								<div class="cwp_t clearfix">
									<div class="cpt_l fl">
										<h3>剑圣传奇</h3>
										<p>2014-07-09</p>
										<span>使用次数:20</span>
										<div class="cpt_line">
											
										</div>
									</div>
									<div class="cpt_r fr">
										<div class="cpt_rt">
											购买
										</div>
										<div class="cpt_rb fr">
											<img src="img/start.png"/>
										</div>
									</div>
								</div>
								<div class="cwp_b">
									<img src="img/pic_t_01.png"/>
								</div>
							</div>
							<div class="cmb_wrap">
								<div class="cwp_t clearfix">
									<div class="cpt_l fl">
										<h3>PLAGUE LNC</h3>
										<p>2014-07-09</p>
										<span>使用次数:20</span>
										<div class="cpt_line">
											
										</div>
									</div>
									<div class="cpt_r fr">
										<div class="cpt_rt">
											购买
										</div>
										<div class="cpt_rb fr">
											<img src="img/start.png"/>
										</div>
									</div>
								</div>
								<div class="cwp_b">
									<img src="img/pic_t_02.png"/>
								</div>
							</div>
							<div class="cmb_wrap">
								<div class="cwp_t clearfix">
									<div class="cpt_l fl">
										<h3>地狱边境</h3>
										<p>2014-07-09</p>
										<span>使用次数:20</span>
										<div class="cpt_line">
											
										</div>
									</div>
									<div class="cpt_r fr">
										<div class="cpt_rt">
											购买
										</div>
										<div class="cpt_rb fr">
											<img src="img/start.png"/>
										</div>
									</div>
								</div>
								<div class="cwp_b">
									<img src="img/pic_t_03.png"/>
								</div>
							</div>
						</div>
					</div>
					<div class="ctc_m">
						<div class="cmt clearfix">
							<div class="cmt_l fl">
								<h3>抽奖游戏</h3>
								<p><span>Lottery</span> game</p>
							</div>
							<div class="cmt_r fl">
								<p>形式各样抽奖游戏，引发全民尖叫，惊喜不断。 还不马上购买，植入你要传播的产品？</p>
							</div>
						</div>
						<div class="cmb clearfix">
							<div class="cmb_wrap">
								<div class="cwp_t clearfix">
									<div class="cpt_l fl">
										<h3>功夫西游</h3>
										<p>2014-07-09</p>
										<span>使用次数:20</span>
										<div class="cpt_line">
											
										</div>
									</div>
									<div class="cpt_r fr">
										<div class="cpt_rt">
											购买
										</div>
										<div class="cpt_rb fr">
											<img src="img/start.png"/>
										</div>
									</div>
								</div>
								<div class="cwp_b">
									<img src="img/pic_c_01.png"/>
								</div>
							</div>
							<div class="cmb_wrap">
								<div class="cwp_t clearfix">
									<div class="cpt_l fl">
										<h3>宝石迷阵</h3>
										<p>2014-07-09</p>
										<span>使用次数:20</span>
										<div class="cpt_line">
											
										</div>
									</div>
									<div class="cpt_r fr">
										<div class="cpt_rt">
											购买
										</div>
										<div class="cpt_rb fr">
											<img src="img/start.png"/>
										</div>
									</div>
								</div>
								<div class="cwp_b">
									<img src="img/pic_c_02.png"/>
								</div>
							</div>
							<div class="cmb_wrap">
								<div class="cwp_t clearfix">
									<div class="cpt_l fl">
										<h3>植物大战僵尸</h3>
										<p>2014-07-09</p>
										<span>使用次数:20</span>
										<div class="cpt_line">
											
										</div>
									</div>
									<div class="cpt_r fr">
										<div class="cpt_rt">
											购买
										</div>
										<div class="cpt_rb fr">
											<img src="img/start.png"/>
										</div>
									</div>
								</div>
								<div class="cwp_b">
									<img src="img/pic_c_03.png"/>
								</div>
							</div>
						</div>
					</div>
					<!--中间栏底部-->
					<div class="ctc_b ctc_m">
						<div class="cmt clearfix">
							<div class="cmt_l fl">
								<h3>经典案例分享</h3>
								<p><span>Lottery</span> game</p>
							</div>
							<div class="cmt_r fl">
								<p>大家对胖糖的信赖， 来源于其产品与需求巧妙结合的经典营销效果。</p>
							</div>
						</div>
						<div class="cmb clearfix">
							<div class="ctb_wrap clearfix">
								<div class="cw_l fl">
									<img src="img/pic_b_01.png"/>
								</div>
								<div class="cw_m fl">
									<h3>南方航空</h3>
									<p>飞行挑战赛</p>
									<p>2014年5月14日--5月27日</p>
									<p>扫码关注微信参加飞行挑战赛并抽奖 即有机会赢取丰厚奖品</p>
								</div>
								<div class="cw_r fl">
									<img src="img/pic_b_02.png"/>
								</div>
							</div>
							<div class="ctb_wrap clearfix">
								<div class="cw_l fl">
									<img src="img/pic_b_01.png"/>
								</div>
								<div class="cw_m fl">
									<h3>南方航空</h3>
									<p>飞行挑战赛</p>
									<p>2014年5月14日--5月27日</p>
									<p>扫码关注微信参加飞行挑战赛并抽奖 即有机会赢取丰厚奖品</p>
								</div>
								<div class="cw_r fl">
									<img src="img/pic_b_02.png"/>
								</div>
							</div>
							<div class="ctb_wrap clearfix">
								<div class="cw_l fl">
									<img src="img/pic_b_01.png"/>
								</div>
								<div class="cw_m fl">
									<h3>南方航空</h3>
									<p>飞行挑战赛</p>
									<p>2014年5月14日--5月27日</p>
									<p>扫码关注微信参加飞行挑战赛并抽奖 即有机会赢取丰厚奖品</p>
								</div>
								<div class="cw_r fl">
									<img src="img/pic_b_02.png"/>
								</div>
							</div>
							<div class="ctb_wrap clearfix">
								<div class="cw_l fl">
									<img src="img/pic_b_01.png"/>
								</div>
								<div class="cw_m fl">
									<h3>南方航空</h3>
									<p>飞行挑战赛</p>
									<p>2014年5月14日--5月27日</p>
									<p>扫码关注微信参加飞行挑战赛并抽奖 即有机会赢取丰厚奖品</p>
								</div>
								<div class="cw_r fl">
									<img src="img/pic_b_02.png"/>
								</div>
							</div>
							
						</div>
					</div>
				</div>
				<!--右边栏-->
				<div class="cont_r fl">
					<div class="cr_pic1">
						<img src="img/right_01.png"/>
					</div>
					<div class="cr_pic2">
						<img src="img/right_02.png"/>
					</div>
					<div class="cr_pic3">
						<img src="img/right_03.png"/>
					</div>
				</div>
			</div>
			<footer>
				<div class="f_p">
					<p>Copyright © 2014 Pangtang. All Rights Reserved. 版权所有</p>
				</div>
				<div class="f_img">
					<img src="common/images/foot.png"/>
				</div>
			</footer>
		</div>
		
		<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/js/swiper.min.js"></script>
		<script>        
		  var mySwiper = new Swiper ('.swiper-container', {
//		    direction: 'vertical', // 垂直切换选项
		    loop: true, // 循环模式选项
		    autoplay:true,//自动切换
		    
		    // 如果需要分页器
		    pagination: {
		      el: '.swiper-pagination',
		    },
		    
//		    // 如果需要前进后退按钮
//		    navigation: {
//		      nextEl: '.swiper-button-next',
//		      prevEl: '.swiper-button-prev',
//		    },
//		    
//		    // 如果需要滚动条
//		    scrollbar: {
//		      el: '.swiper-scrollbar',
//		    },
		  }) 
		</script> 
	</body>
</html>

